import * as React from 'react'
import {compose} from 'recompose'
import {curry} from 'ramda'
import NoSSR from 'react-no-ssr'
import {QueryComponent} from '../util/index'

export default curry(({gql, name, id}, ComposedComponent: React.Component) => {
    return class ComponentWithUpsert extends React.Component {

        render() {
            const _id = typeof id == 'function' ? id(this.props) : id;
            return (
                <NoSSR onSSR={<div/>}>
                    <QueryComponent gql={gql}
                                    options={{variables: {id: _id}, skip: !_id}}
                                    render={props => (
                                        <ComposedComponent {...this.props} {...{[name]: props && props[name]}} />)}
                    />
                </NoSSR>
            )
        }
    }
})